const panels = document.querySelectorAll('.panel');
var i = 0
var last = "Sseg"
$(function(){
    initIndex()
})


function initIndex(){
    //h1text = "目标提取"
    $(".text h1").text(textlist[0])
    $(".text p").text(textlist[1])
    $(".text a").text(textlist[2].split("|")[0])
    $(".text a").attr("href",textlist[2].split("|")[1])
    panels.forEach(panel =>{
        panel.addEventListener('mouseover', ()=>{
            removeActiveClasses()
            switch (panel.id){
                case "Sseg":
                    //目标提取文案
                    //h1text = "目标提取"
                    $(".text h1").text(textlist[0])
                    $(".text p").text(textlist[1])
                    $(".text a").text(textlist[2].split("|")[0])
                    $(".text a").attr("href",textlist[2].split("|")[1])
                    break
                case "CdSeg":
                    //变换检测文案
                    h1text = "变化检测"
                    $(".text h1").text(textlist[3])
                    $(".text p").text(textlist[4])
                    $(".text a").text(textlist[5].split("|")[0])
                    $(".text a").attr("href",textlist[5].split("|")[1])
                    break
                case "Det":
                    //目标检测文案
                    h1text = "目标检测"
                    $(".text h1").text(textlist[6])
                    $(".text p").text(textlist[7])
                    $(".text a").text(textlist[8].split("|")[0])
                    $(".text a").attr("href",textlist[8].split("|")[1])
                    break
                case "PDet":
                    //地物分类文案
                    h1text = "地物分类"
                    $(".text h1").text(textlist[9])
                    $(".text p").text(textlist[10])
                    $(".text a").text(textlist[11].split("|")[0])
                    $(".text a").attr("href",textlist[11].split("|")[1])
                    break
                default:
                    break
            }
            //$(".text").rotate(360)
            if (last!=panel.id) {
                last = panel.id
                if (i%2==0){
                    $(".text h1").css("transform","rotateY(360deg)")
                    $(".text p").css("transform","rotateY(360deg)")
                    $(".text a").css("transform","rotateY(360deg)")
                    i = (i+1)%2
                }else {
                    $(".text h1").css("transform","rotateY(0deg)")
                    $(".text p").css("transform","rotateY(0deg)")
                    $(".text a").css("transform","rotateY(0deg)")
                    i = (i+1)%2
                }
            }
            //$(".text").addClass("texttrun")
            panel.classList.add('active')
        })
    })
}

function removeActiveClasses(){
    panels.forEach(panel =>{
        panel.classList.remove('active')
    })
}


